<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity5">
<head>
    <meta charset="UTF-8">
    <meta name="description" content="">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- The above 4 meta tags *must* come first in the head; any other head content must come *after* these tags -->

   <!-- Title  -->
    <title th:text="${site_name}">Essence - Fashion Ecommerce Template</title>

    <!-- Favicon  -->
    <link rel="icon" th:href="@{/essence/img/core-img/favicon.ico}">

    <!-- Core Style CSS -->
    <link rel="stylesheet" data-th-href="@{/essence/css/core-style.css}">
    <link rel="stylesheet" data-th-href="@{/essence/style.css}">

</head>

<body>
    <!-- ##### Header Area Start ##### -->
    <header class="header_area">
        <div class="classy-nav-container breakpoint-off d-flex align-items-center justify-content-between">
            <!-- Classy Menu -->
            <nav class="classy-navbar" id="essenceNav">
                <!-- Logo -->
                <a class="nav-brand" href="index.html"><img th:src="@{/essence/img/core-img/logo.png}" alt=""></a>
                <!-- Navbar Toggler -->
                <div class="classy-navbar-toggler">
                    <span class="navbarToggler"><span></span><span></span><span></span></span>
                </div>
                <!-- Menu -->
                <div class="classy-menu">
                    <!-- close btn -->
                    <div class="classycloseIcon">
                        <div class="cross-wrap"><span class="top"></span><span class="bottom"></span></div>
                    </div>
                    <!-- Nav Start -->
                    <div class="classynav">
                        <ul> 
                            <li th:each="nav : ${navs.children}"><a th:text="${nav.text}" th:href="${nav.url}">Pages</a>
                               <th:block th:if="${not #lists.isEmpty(nav.children)}">
                                <ul class="dropdown">
                                    <li th:each="nav1 : ${nav.children}"><a th:text="${nav1.text}" th:href="${nav1.url}">Home</a></li>
                                </ul>
                                </th:block>
                            </li>
                        </ul>
                    </div>
                    <!-- Nav End -->
                </div>
            </nav>

            <!-- Header Meta Data -->
            <th:block data-th-include="themes/essence/hmeta"></th:block>
            <!-- Header Meta Data end -->

        </div>
    </header>
    <!-- ##### Header Area End ##### -->

    <!-- ##### Right Side Cart Area ##### -->
    <th:block data-th-include="themes/essence/cart"></th:block>
    <!-- ##### Right Side Cart End ##### -->

    <!-- ##### Blog Wrapper Area Start ##### -->
    <div class="single-blog-wrapper">

        <!-- Single Blog Post Thumb -->
        <div class="single-blog-post-thumb">
            <img  th:src="@{/essence/img/bg-img/bg-8.jpg}" alt="">
        </div>

        <div class="container">
            <div class="row justify-content-center">
                <div class="col-12 col-md-8">
                    <div class="regular-page-content-wrapper section-padding-80">
                        <div class="regular-page-text">
                            <h2 th:text="${singlePage.title}">Vivamus sed nunc in arcu cursus mollis quis et orci. Interdum et malesuada</h2>
                            <th:block th:utext="${singlePage.content}"></th:block>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- ##### Blog Wrapper Area End ##### -->

      <!-- ##### Footer Area Start ##### -->
    <th:block data-th-include="themes/essence/footer"></th:block>
    <!-- ##### Footer Area End ##### -->
    <!-- jQuery (Necessary for All JavaScript Plugins) -->
    <script data-th-src="@{/essence/js/jquery/jquery-2.2.4.min.js}"></script>
    <script data-th-src="@{/essence/js/jquery.tmpl.min.js}"></script>
    <!-- Popper js -->
    <script data-th-src="@{/essence/js/popper.min.js}"></script>
    <!-- Bootstrap js -->
    <script data-th-src="@{/essence/js/bootstrap.min.js}"></script>
    <!-- Plugins js -->
    <script data-th-src="@{/essence/js/plugins.js}"></script>
    <!-- Classy Nav js -->
    <script data-th-src="@{/essence/js/classy-nav.min.js}"></script>
    <!-- Active js -->
    <script data-th-src="@{/essence/js/active.js}"></script>
    <script data-th-src="@{/essence/js/product.js}"></script>
    <script data-th-src="@{/essence/js/sku.js}"></script>
    <script data-th-inline="javascript">
      var ctx = [[@{/}]];
       // 初始化购物车
      $Product.refreshCart();
    </script>

</body>

</html>